<!DOCTYPE html>
<script src='../../../../../resources/gesture-util.js'></script>
<style>
  body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    background-color: red;
  }
  ::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
  div {
    width: 50%;
    height: 50%;
    position: absolute;
    left: 25%;
    top: 25%;
    background-color: green;
    border: 5px solid black;
    box-sizing: border-box;
  }
</style>

<div></div>

<script>
  window.onload = async () => {
    // Test that pinch-zoom gesture into a specific location zooms into the
    // correct location and the expected portion of the page is drawn on
    // screen.
    testRunner.waitUntilDone();
    await waitForCompositorCommit();
    await pinchBy(2, 400, 300, SPEED_INSTANT, GestureSourceType.MOUSE_INPUT);
    await waitFor(() => { return window.visualViewport.scale >= 1.98; });
    testRunner.notifyDone();
  }
</script>
